<template>
    <div>
        <select v-model="select">
            <option value="wyz">吴彦祖</option>
            <option value="pyy">彭于晏</option>
            <option value="ldh">刘德华</option>
        </select>
        <div><input type="text" v-model="mytext">模糊搜索</div>
        <ul>
            <li v-for="data in computedList" :key="data.id">
                {{ data.content }}
            </li>
        </ul>
    </div>
</template>

<script>
import useList from './hooks/useList.js';
import useSearch from './hooks/useSearch.js'

export default {
    setup() {
        const { select, datalist } = useList()

        const { mytext, computedList } = useSearch(datalist)

        return {
            select,
            mytext,
            computedList
        }
    },
}
</script>